/*
 * @Description: 关_棺
 * @Author: 关_棺
 * @Date: 2024-06-12 07:58:09
 * @LastEditTime: 2024-07-25 11:16:16
 * @FilePath: \supervision-ui\src\mixins\scrollMixin.js
 */
// 定义一个名为 scrollMixin 的常量，它包含一些方法和生命周期钩子，用于处理表格的滚动效果
export const scrollMixin = {
  methods: {
    // 当鼠标进入某个元素时调用此方法
    mouseEnter(refName) {
      // 清除指定 refName 对应的间隔，停止滚动
      clearInterval(this.intervals[refName]);
    },
    // 当鼠标离开某个元素时调用此方法
    mouseLeave(refName) {
      // 为指定 refName 设置一个新的间隔，每隔 50 毫秒调用一次 scroll 方法
      this.intervals[refName] = setInterval(() => this.scroll(refName), 50);
    },
    // 实现表格滚动的核心方法
    scroll(refName) {
      try {
        // 获取指定 refName 对应的表格元素
        let scrollTable = this.$refs[refName];
        // 如果找不到对应的表格元素，则直接返回
        if (!scrollTable) return;
        // 获取表格的最大高度
        let maxHeight =
          scrollTable.$el.querySelectorAll(".el-table__body")[0].offsetHeight;
        // 获取表格的客户端高度
        let clientHeight = scrollTable.bodyWrapper.clientHeight;
        // 如果表格的滚动高度接近最大高度，则重置滚动位置
        if (
          Math.abs(
            scrollTable.bodyWrapper.scrollTop - (maxHeight - clientHeight)
          ) < 5
        ) {
          setTimeout(() => {
            scrollTable.bodyWrapper.scrollTop = 0;
          }, 50);
        } else {
          // 否则，逐步增加滚动高度
          scrollTable.bodyWrapper.scrollTop += 1;
        }
      } catch (err) {
        // 捕获并打印任何可能的错误
        console.log(err);
      }
    },
    // 初始化滚动的辅助方法
    initScroll(refName) {
      // 为指定 refName 设置一个新的间隔，每隔 50 毫秒调用一次 scroll 方法
      this.intervals[refName] = setInterval(() => this.scroll(refName), 50);
    },
  },
  data() {
    return {
      intervals: {}, // 使用对象来管理多个间隔
    };
  },
  mounted() {
    this.$nextTick(() => {
      // 遍历所有 ref，找到满足特定命名前缀的 ref 并初始化滚动
      Object.keys(this.$refs).forEach((refName) => {
        if (refName.startsWith("scrollTable")) {
          this.initScroll(refName);
        }
      });
    });
  },
  beforeDestroy() {
    // 在组件销毁前清除所有间隔，避免内存泄漏
    Object.values(this.intervals).forEach(clearInterval);
  },
};
